<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" dir="ltr">
<head profile="http://gmpg.org/xfn/11">
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Featured Content Slider using jQuery UI - Web Developer Plus Demos</title>

<script type="text/javascript" src="js/jquery-1.3.2.min.js" ></script>
<script type="text/javascript" src="js/jquery-ui-1.7.2.custom.min.js" ></script>
<script type="text/javascript" >
$(document).ready(function(){
	$('#tabs').tabs();
});
</script>
<style type="text/css" >
#tabs{ width:400px; height:250px; border:1px solid #ccc;}
#tabs ul{ list-style:none; margin:0; padding:0; }
#tabs ul li{ display:inline; margin:0 10px; }
#tabs .tabs-panel{ position:relative; width:400px; height:200px; overflow:hidden;}
</style>
</head>
<body>
<div id="tabs">
   <ul>
      <li><a href="#tabs-1">Nunc tincidunt</a></li>
      <li><a href="#tabs-2">Proin dolor</a></li>
      <li><a href="#tabs-3">Aenean lacinia</a></li>
   </ul>
   <div id="tabs-1" class="tabs-panel selected">
      <p>Tab 1 contentTab 1 contentTab 1 contentTab 1 contentTab 1 contentTab 1 contentTab 1 contentTab 1 contentTab 1 contentTab 1 contentTab 1 content</p>
   </div>
   <div id="tabs-2" class="tabs-panel">
      <p>Tab 2 contentTab 2 contentTab 2 contentTab 2 contentTab 2 contentTab 2 contentTab 2 contentTab 2 contentTab 2 contentTab 2 contentTab 2 contentTab 2 contentTab 2 content</p>
   </div>
   <div id="tabs-3" class="tabs-panel">
      <p>Tab 3 contentTab 3 contentTab 3 contentTab 3 contentTab 3 contentTab 3 contentTab 3 contentTab 3 contentTab 3 contentTab 3 contentTab 3 contentTab 3 contentTab 3 contentTab 3 contentTab 3 </p>
   </div>
</div>
</body>
</html>